{% extends 'public/base.html' %}

{% block header %}
<!-- Data Tables -->
<link href="__static__/hplus/css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
<link href="__static__/hplus/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css" rel="stylesheet">
{% endblock %}

{% block body %}
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="ibox ">
            <div class="ibox-title">
                <button class="btn btn-primary btn-outline ajaxDialog" data-url="addFunction" data-title="添加系统功能">添加系统功能</button>
            </div>
            <div class="ibox-content">
                <table class="table table-striped table-bordered table-hover " id="functionTable">
                    <thead>
                    <tr>
                        <th>模块</th>
                        <th>控制器</th>
                        <th>方法</th>
                        <th>名称</th>
                        <th>描述</th>
                        <th>类型</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
    </div>
</div>
</body>
{% endblock %}

{% block scripts %}
<script src="__static__/hplus/js/jquery.min.js?v=2.1.4"></script>
<script src="__static__/hplus/js/plugins/bootbox/bootbox.min.js"></script>
<script src="__static__/hplus/js/bootstrap.min.js?v=3.3.5"></script>
<script src="__static__/hplus/js/plugins/jeditable/jquery.jeditable.js"></script>
<script src="__static__/hplus/js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="__static__/hplus/js/plugins/dataTables/dataTables.bootstrap.js"></script>
<script src="__static__/hplus/js/content.min.js?v=1.0.0"></script>
<script src="__static__/userDefine.js"></script>
<script>
    $(document).ready(function(){
        $("#functionTable").dataTable(
            {
                'autoWidth': false,
                'iDisplayLength': 10,
                'bServerSide' : true,
                'aoColumns':[
                    {
                        "mData": 'module',
                        'sClass':'text-center',
                        'sWidth':'20',
                        'bSortable':false
                    }, {
                        "mData": 'controller',
                        'sClass':'text-center',
                        'sWidth':'20',
                        'bSortable':false
                    }, {
                        "mData": 'action_name',
                        'sClass':'text-center',
                        'sWidth':'20',
                        'bSortable':false
                    }, {
                        "mData": 'name',
                        'sClass':'text-center',
                        'sWidth':'20',
                        'bSortable':false
                    }, {
                        "mData": 'description',
                        'sClass':'text-center',
                        'sWidth':'60',
                        'bSortable':false
                    }, {
                        "mData": 'type',
                        'sClass':'text-center',
                        'sWidth':'20',
                        'bSortable':false
                    }, {
                        "mData": 'status',
                        'sClass':'text-center',
                        'sWidth':'20',
                        'bSortable':false
                    }, {
                        "mData": 'action',
                        'sClass':'text-center',
                        'sWidth':'80',
                        'bSortable':false
                    }
                ],
                'fnServerParams' : function (aoData) {
//                    var elememts = getElements('#functionSearchForm');
//                    $.each(elememts, function(key, val) {
//                        aoData.push( { "name": key, "value": val } );
//                    });
                },
                'aoColumnDefs' : [
                    {
                        'aTargets' : [7],
                        'mRender' : function (data, type, full) {
                            return '<button class="btn btn-info btn-outline btn-sm ajaxDialog" type="button" data-title="更新系统功能" data-url="editFunction" data-params="{fid:'+ full.id +'}"><i class="fa fa-paste"></i>编辑</button> &nbsp;&nbsp;'
                                +'<button class="btn btn-danger btn-outline btn-sm ajax" type="button" data-title="操作将不可逆，确定删除此项？" data-url="deleteFunction" data-params="{fid:'+ full.id +'}"><i class="fa fa-trash"></i> <span class="bold">删除</span></button>';
                        }
                    }
                ],
                'sAjaxSource': '/admin/function/index',
                'fnServerData': function (sSource, aoData, fnCallback) {
                    $.ajax({
                        'type': 'post',
                        'url': sSource,
                        'dataType': 'json',
                        'data': {
                            aoData: JSON.stringify(aoData)
                        },
                        'success': function (resp) {
                            fnCallback(resp);
                        }
                    });
                },
                "fnRowCallback" : function(nRow, aData, iDisplayIndex) {
//                    if(aData.status == 0){
//                        $('td:eq(5)', nRow).html('<span class="label label-sm label-warning">禁用</span>');
//                    }else{
//                        $('td:eq(5)', nRow).html('<span class="label label-sm label-success">启用</span>');
//                    }
//                    return nRow;
                },
            }
        );
    });
    //获取表单参数
//    function getElements(formId) {
//        var elements = {};
//        var data = $(formId).serializeArray();
//        $.each(data, function() {
//            elements[this.name] = this.value;
//        });
//
//        return elements;
//    }
</script>
{% endblock %}